<template>
    <div class="award-list">

        <div class="award-title">
            <div> 评选表彰</div>
            <!-- <div @click="handleMore" class="more">更多</div> -->
        </div>


        <div class="award-item" v-for="item in list" :key="item.id" @click="handleToDetail(item)">

            <div class="award-item__left">
                <img class="avatar" :src="item.avatar">
            </div>

            <div class="award-item__right">


                <div class="name">
                    {{ item.name }}
                </div>

                <div class="title">
                    {{ item.title }}
                </div>
            </div>


        </div>
    </div>

</template>

<script>



export default {
    data() {

        return {
            kindId:1,
            list: [],
        }
    },

    created() {
        this.init()
    },

    methods: {
        async init() {
            const { data } = await this.$fetch.post(`/api/award-kind/list`);
            if (Array.isArray(data)) {
                this.kindId = data.find((item)=> item.isLatest).kindId;
                console.log("this.kindId", this.kindId )
            }
            this.getData();
        },

        async getData() {
            const { data } = await this.$fetch.post(` /api/award-list/list`, { kindId: this.kindId});
            this.list = data.slice(0,10);
        },

        handleToDetail() {
            window.open("http://www.accem.org.cn/a/bzmd/dswj/2016/1214/17836.html")
        }
    }
 

}
</script>

<style lang="less" scoped>
.award-list {
    padding: 22px 22px 22px 25px;
}

.award-title {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 25px;
    color: #000000;
    padding-bottom: 14px;
    line-height: 36px;
    text-align: left;
    font-style: normal;
    text-transform: none;
    border-bottom: 1px solid #efefef;
    display: flex;
    align-items: center;
    justify-content: space-between;

    .more {
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 16px;
        color: #3268AE;
        line-height: 22px;
        text-align: right;
        font-style: normal;
        text-transform: none;
        cursor: pointer;
    }
}


.award-item {
    margin-top: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    cursor: pointer;

    .award-item__left {
        .avatar {
            width: 74px;
            height: 84px;
            object-fit: cover;
        }
    }

    .award-item__right {
        margin-left: 17px;

        .name {
            font-family: PingFangSC, PingFang SC;
            font-weight: bolder;
            font-size: 18px;
            color: #333333;
            line-height: 25px;
            text-align: left;
            font-style: normal;
            text-transform: none;
            margin-bottom: 7px;
        }

        .title {
            font-family: PingFangSC, PingFang SC;
            font-weight: 400;
            font-size: 16px;
            color: #484848;
            line-height: 22px;
            text-align: left;
            font-style: normal;
            text-transform: none;
            word-break: break-all;
        }

    }

}
</style>